<template>
  <button @click="btnClick" ref="btnRef">点击</button>
  <hr />
  <Son ref="SonRef"></Son>
</template>

<script>
import { computed, ref, watch, watchEffect } from 'vue'
import Son from './Son.vue'
export default {
  components: { Son },
  setup() {
    const btnRef = ref(null)
    const SonRef = ref(null)
    // setup函数内部在元素挂载之前，无法拿到元素
    console.log(SonRef.value)
    
    const btnClick = () => {
      console.log('按钮被点击了', btnRef.value)
      console.log('按钮被点击了', SonRef.value)
      SonRef.value.sonClick()
    }
    return { btnClick, btnRef, SonRef }
  },
}
</script>
<style scoped></style>
